
fetch('http://chst.vip:1234/api/getgsshop')
.then(function(a){
    return a.json()
})
.then(function(b){
    console.log(b);
    let str = '';
    b.result.forEach(item => {
        str +=`<li shopId=${item.shopId}>
                ${item.shopName}
                </li>`
    });
    $('.three').html(str)
})
.then(function(){
    $('.three').on('click','li',function(){
       let shopName =  $(this).text();
       $('nav p:nth-of-type(1) span:nth-of-type(1)').html(shopName);
    })
})
.then(function(){
    $('.three').slideUp();
    $('p:eq(0)').on('click',function(){
        $(this).parent().next().slideToggle();
        $(this).parent().next().next().slideUp();
    })
})

fetch('http://chst.vip:1234/api/getgsshoparea')
.then(function(a){
    return a.json()
})
.then(function(b){
    console.log(b);
    let str = '';
    b.result.forEach(item => {
        str +=`<li areaId=${item.areaId}>
                ${item.areaName}
                </li>`
    });
    $('.four').html(str)
})
.then(function(){
    $('.four').on('click','li',function(){
       let areaName =  $(this).text();
       $('nav p:nth-of-type(2) span:nth-of-type(1)').html(areaName);
    })
})
.then(function(){
    $('.four').slideUp();
    $('p:eq(1)').on('click',function(){
        $(this).parent().next().next().slideToggle();
        $(this).parent().next().slideUp();

    })
})
.then(function(){
    var shopId;
    var areaId;
    $('.three').on('click','li',function(){
        var shopId=$(this).attr('shopId');
        console.log(shopId);
        $('main').attr('shopid',shopId)

        shopId=$('main').attr('shopid')
        areaId=$('main').attr('areaid')
       // console.log(shopId);
       fetch(`http://chst.vip:1234/api/getgsproduct?shopid=${shopId}&areaid=${areaId}`)
       .then(function(a){
           return a.json()
       })
       .then(function(b){
           console.log(b);
           let str='';
           b.result.forEach(item => {
               str +=`<div>
                           <img src=${item.productImg}>
                           <p>${item.productName}</p>
                           <p>${item.productPrice}</p>  
                       </div>`
           });
           $('main').html(str)
       })


    })
    $('.four').on('click','li',function(){
        var areaId=$(this).attr('areaId');
        console.log(areaId)
        $('main').attr('areaid',areaId)


        shopId=$('main').attr('shopid')
        areaId=$('main').attr('areaid')
       // console.log(shopId);
       fetch(`http://chst.vip:1234/api/getgsproduct?shopid=${shopId}&areaid=${areaId}`)
       .then(function(a){
           return a.json()
       })
       .then(function(b){
           console.log(b);
           let str='';
           b.result.forEach(item => {
               str +=`<div>
                           <img src=${item.productImg}>
                           <p>${item.productName}</p>
                           <p>${item.productPrice}</p>  
                       </div>`
           });
           $('main').html(str)
       })
    })
    shopId=$('main').attr('shopid')
    areaId=$('main').attr('areaid')
   // console.log(shopId);
   fetch(`http://chst.vip:1234/api/getgsproduct?shopid=${shopId}&areaid=${areaId}`)
   .then(function(a){
       return a.json()
   })
   .then(function(b){
       console.log(b);
       let str='';
       b.result.forEach(item => {
           str +=`<div>
                       <img src=${item.productImg}>
                       <p>${item.productName}</p>
                       <p>${item.productPrice}</p>  
                   </div>`
       });
       $('main').html(str)
   })
})

